<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="utf-8">
    <title>测试Layer弹出框</title>
    <script src="http://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script>
    <script th:src="@{/layer/layer.js}" type="text/javascript"></script>
    <script src="http://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script>
    <script th:src="@{/webstore/js/bootstrap-3.1.1.min.js}" type="text/javascript"></script>
 	<link rel="icon" th:href="@{/admin/images/head_incon.png}" type="image/x-icon"/>
	<link th:href="@{/webstore/css/bootstrap.css}" rel="stylesheet" type="text/css" media="all" ></link>
	<link th:href="@{/webstore/css/style.css}" rel="stylesheet" type="text/css" media="all" ></link>
	<link th:href="@{/webstore/css/animate.min.css}" rel="stylesheet" type="text/css"></link>
	<link th:href="@{/layer//theme/default/layer.css}" rel="stylesheet" type="text/css"></link>
	<link href='https://fonts.googleapis.com/css?family=Cabin:400,500,600,700' rel='stylesheet' type='text/css'></link>
	<link href='https://fonts.googleapis.com/css?family=Lato:400,100,300,700,900' rel='stylesheet' type='text/css'></link>
</head>
<body>

<div class="box" style="text-align:center">
  <a href="javascript:;" id="about">关于</a>
</div>

<script>
;!function(){


//页面一打开就执行，放入ready是为了layer所需配件（css、扩展模块）加载完毕
layer.ready(function(){ 
  layer.open({
    type: 2,
    title: '欢迎页',
    maxmin: true,
    area: ['800px', '500px'],
    content: 'http://layer.layui.com/test/welcome.html',
    end: function(){
      layer.tips('Hi', '#about', {tips: 1})
    }
  });
});

//关于
$('#about').on('click', function(){
  layer.alert(layer.v + ' - 贤心出品 sentsin.com');
});

}();
</script>
</body>
</html>